<template>
  <div class="container">
    <div class="Comment_First_box" v-for="(item, index) in 6">
      <div class="Usertalk_comment_box">
        <div class="left_box_Comment">
          <img
            src="https://zbbs.jd.com/uc_server/avatar.php?uid=1651253&size=middle"
            alt=""
            class="left_Img_Comment"
          />
        </div>
        <div class="right_box_Comment">
          <div class="author_right_box_Comment">
            <span class="name_author_right_box_Comment">姓名</span>
            <span class="sendTime_author_right_box_Comment">发表于</span>
            <span class="sendTime_author_right_box_Comment"
              >2020年6月28日 16:18</span
            >
            <span class="tower_author_right_box_Comment">沙发</span>
          </div>
          <div class="commentContent_right_box_Comment">
            <span>
              平台上线流程如下： 1.
              先把项目BP发送给我们，我们会按照商业模式、团队资质、发展潜力等方向进行审核，一般一个工作天能完成，如果通过初步审核，会到下一步
            </span>
          </div>
          <div>
            <span>回复</span>
            <span>支持</span>
            <span>反对</span>
            <span>转发</span>
          </div>
        </div>
      </div>
    </div>
    <div class="page_big_box">
      <div class="page_box">
        <Page :total="100" class="page"></Page>
      </div>
    </div>
    <div class="Isay_big_box_comment">
      <div class="left_box_Comment">
        <img
          src="https://zbbs.jd.com/uc_server/avatar.php?uid=1651253&size=middle"
          alt=""
          class="left_Img_Comment"
        />
      </div>
      <div class="talkBox_Comment"></div>
    </div>
    <div class="comment_buttom"></div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.Comment_First_box {
  width: 60%;
  height: 300px;
  background: white;
}
.Usertalk_comment_box {
  height: 230px;
  border-bottom: 1px #f2f2f2 solid;
}
.Message_Img_box_Comment {
  width: 20%;
}
.left_box_Comment {
  float: left;
  width: 11%;
  height: 100%;
}
.left_Img_Comment {
  width: 76%;
  float: right;
  margin-top: 10px;
}
.right_box_Comment {
  width: 82%;
  float: left;
  margin-left: 3%;
}
.author_right_box_Comment {
  width: 100%;
  height: 60px;
  /* border: 1px solid black; */
  padding-top: 12px;
}
.name_author_right_box_Comment {
  color: #60717e;
  font-size: 16px;
  font-weight: normal;
}
.sendTime_author_right_box_Comment {
  color: #aaa;
  font-size: 12px;
  padding-left: 1%;
}
.tower_author_right_box_Comment {
  float: right;
  padding-left: 3%;
  padding-right: 3%;
  background: #aaa;
  border-radius: 7px;
  color: #eee;
}
.commentContent_right_box_Comment {
  font: 16px arial, "Microsoft Yahei", "Hiragino Sans GB", sans-serif;
  color: #444;
  border-bottom: 1px dashed #eee;
  height: 120px;
}
.page_big_box {
  width: 60%;
  height: 70px;
}
.page_box {
  margin-top: 20px;
  float: right;
}
.Isay_big_box_comment {
  width: 60%;
  height: 200px;
  background: white;
}
.comment_buttom {
  width: 100%;
  height: 60px;
}
.talkBox_Comment {
  width: 80%;
  height: 130px;
  border: 1px solid black;
  float: left;
  margin-top: 20px;
  margin-left: 4%;
}
</style>
